import { Plugin, SpecialZoomLevel } from "../../core";
import { ReactElement, ReactNode } from "react";

export interface ZoomMenuItemProps {
  onClick: () => void;
}

// ------------------------
// Render zooming in button
// ------------------------

export interface RenderZoomInProps {
  onClick: () => void;
}

export interface ZoomInProps {
  children?: (props: RenderZoomInProps) => ReactElement;
}

// -------------------------
// Render zooming out button
// -------------------------

export interface RenderZoomOutProps {
  onClick: () => void;
}

export interface ZoomOutProps {
  children?: (props: RenderZoomOutProps) => ReactNode;
}

// -------------
// Current scale
// -------------

export interface RenderCurrentScaleProps {
  scale: number;
}

export interface CurrentScaleProps {
  children?: (props: RenderCurrentScaleProps) => ReactElement;
}

// -------------------
// Zoom to given scale
// -------------------

export interface RenderZoomProps {
  scale: number;
  onZoom(newScale: number | SpecialZoomLevel): void;
}

export interface ZoomProps {
  children?: (props: RenderZoomProps) => ReactElement;
}

// ------
// Plugin
// ------

export interface ZoomPluginProps {
  enableShortcuts?: boolean;
}

export interface ZoomPlugin extends Plugin {
  zoomTo: (scale: number | SpecialZoomLevel) => void;
  CurrentScale: (props: CurrentScaleProps) => ReactElement;
  ZoomIn: (props: ZoomInProps) => ReactElement;
  ZoomInButton: () => ReactElement;
  ZoomInMenuItem: (props: ZoomMenuItemProps) => ReactElement;
  ZoomOut: (props: ZoomOutProps) => ReactElement;
  ZoomOutButton: () => ReactElement;
  ZoomOutMenuItem: (props: ZoomMenuItemProps) => ReactElement;
  Zoom: (props: ZoomProps) => ReactElement;
  ZoomPopover: () => ReactElement;
}
